<style lang="less" scoped src="../public.less"></style>
<script src="./refundrecord.js"></script>

<template>
    <div>
        <Row style="font-size: 15px;">
            <Col span="24">
                学员姓名：<Input v-model="queryData.studentName" clearable style="width: 15%"></Input>
                退费开始时间：  <DatePicker type="date" v-model="queryData.startTime"  style="width:180px"></DatePicker>
                退费结束时间：  <DatePicker type="date" v-model="queryData.endTime"  style="width:180px"></DatePicker>
            </Col>
        </Row>
        <Row style="font-size: 15px;;margin-top: 5px">
            <Col span="22">
                <span @click="loadList"><Button type="primary" icon="android-search">查询</Button></span>
                <span @click="refresh"><Button type="primary" icon="refresh">清空</Button></span>
            </Col>
        </Row>

        <div class="main-table">
            <Table border :columns="columns" :data="dataList"></Table>
        </div>
        <div class="pagination">
            <Page :total="total" size="small" :page-size="pageSize" :current.sync="pageIndex" @on-change="loadList"
                  show-total show-elevator></Page>
        </div>

        <Modal v-model="chargeDetailVisable"
               title="缴费管理"
               width="90%"
               :mask-closable="false">
            <h3>学生信息</h3>
            <Row class="table-Row">
                <Col span="3" class="titele">姓名：</Col>
                <Col span="3" class="content">{{orderDetails.name}}</Col>
                <Col span="3" class="titele">性别：</Col>
                <Col span="3" class="content">{{orderDetails.sex}}</Col>
                <Col span="3" class="titele">出生日期：</Col>
                <Col span="3" class="content">{{orderDetails.birthdate}}</Col>
                <Col span="3" class="titele">身份证号：</Col>
                <Col span="3" class="content">{{orderDetails.cardcode}}</Col>
            </Row>
            <Row class="table-Row">
                <Col span="3" class="titele">家长姓名：</Col>
                <Col span="3" class="content">{{orderDetails.parentname}}</Col>
                <Col span="3" class="titele">家长手机：</Col>
                <Col span="3" class="content">{{orderDetails.parentphone}}</Col>
                <Col span="3" class="titele">是否新生：</Col>
                <Col span="3" class="content"></Col>
            </Row>
            <h3>班级信息</h3>
            <Row class="table-Row">
                <Col span="3" class="titele">班级：</Col>
                <Col span="3" class="content">{{orderDetails.class_name}}</Col>
                <Col span="3" class="titele">班级代码：</Col>
                <Col span="3" class="content">{{orderDetails.class_code}}</Col>
                <Col span="3" class="titele">学年：</Col>
                <Col span="3" class="content">{{orderDetails.class_year}}</Col>
                <Col span="3" class="titele">学期：</Col>
                <Col span="3" class="content">{{orderDetails.class_season_name}}</Col>
            </Row>
            <Row class="table-Row">
                <Col span="3" class="titele">专业：</Col>
                <Col span="3" class="content">{{orderDetails.marjor_name}}</Col>
                <Col span="3" class="titele">专业程度：</Col>
                <Col span="3" class="content">{{orderDetails.marjor_level_name}}</Col>
                <Col span="3" class="titele">年级阶段：</Col>
                <Col span="3" class="content">{{orderDetails.class_school_grade_name}}</Col>
                <Col span="3" class="titele">年龄范围：</Col>
                <Col span="3" class="content">{{orderDetails.class_season_name}}</Col>
            </Row>
            <Row class="table-Row">
                <Col span="3" class="titele">负责教师：</Col>
                <Col span="3" class="content">{{orderDetails.teacher_name}}</Col>
                <Col span="3" class="titele">开课时间：</Col>
                <Col span="3" class="content">{{orderDetails.class_startTime}}</Col>
                <Col span="3" class="titele">课程安排：</Col>
                <Col span="9" class="content">{{orderDetails.classSchedules}}</Col>
            </Row>
            <Row class="table-Row">
                <Col span="3" class="titele">课次：</Col>
                <Col span="3" class="content">{{orderDetails.class_no}}</Col>
                <Col span="3" class="titele">录取方式：</Col>
                <Col span="3" class="content">{{orderDetails.class_apply}}</Col>
            </Row>
            <Row class="table-Row">
                <Col span="3" class="titele">总费用：</Col>
                <Col span="3" class="content">{{orderDetails.amt}}</Col>
            </Row>
            <h3>收费信息</h3>
            <Table border :columns="charge_columns_1" :data="charge_dataList"></Table>
            <div style="margin-top:20px;display: flex;">
                <h1>收费合计:<span style="color: red">{{orderDetails.amt}}</span></h1>
                <h1 style="margin-left: 20px">打折金额:<span style="color: red">{{orderDetails.discount_amt}}</span></h1>
                <h1 style="margin-left:20px"> 应收合计:<span style="color: red">{{orderDetails.real_amt}}</span></h1>
                <h1 style="margin-left:20px"> 退费合计：<span style="color: red">{{orderDetails.refund_amt}}</span></h1>
            </div>
            <div style="text-align: center">
                <Button type="error" @click="showRefund">退费</Button>
                <Button type="error" @click="">返回</Button>
            </div>
        </Modal>
    </div>
</template>
